//首页预加载遍历商品
// $(function () {
//     query();

// })


//查询函数
function query() {
    let keyWord = $('[name=keyWord]').val();
   
            $.get('http://localhost:8000/product?keyWord=' + keyWord, (data) => {
                    query_true(data);
            })
       
}


//遍历商品的函数
function query_true(result) {
    //获取tr内容
    var tb = $('#tb');
    var tr_row = $('.tr_row');

    tr_row.remove();
  

    result.forEach((item,index) => {
        // console.log(item);
        // console.log(index);
        //此判断用来遍历table的斑马纹
        if(index%2==0){
            let html = `
            <tr class="tr_row" style="background-color:rgb(238, 241, 248) ;">
                <td >${item.id}</td>
                <td>${item.product}</td>
                <td>${item.stock}</td>
                <td>${item.price}</td>
                <td>${item.pps}</td>
    
    
                <td>
                    <input type="button" value="编辑" onclick="btn_edit(${item.id})">
                    <input type="button" value="删除" onclick="btn_del(${item.id})">
                </td>
            </tr>
          
        `
        $('#tb').append(html);
        }else{
            let html = `
            <tr class="tr_row" style="background-color:rgb(255,255,255) ;">
                <td >${item.id}</td>
                <td>${item.product}</td>
                <td>${item.stock}</td>
                <td>${item.price}</td>
                <td>${item.pps}</td>
    
    
                <td>
                    <input type="button" value="编辑" onclick="btn_edit(${item.id})">
                    <input type="button" value="删除" onclick="btn_del(${item.id})">
                </td>
            </tr>
          
        `
        $('#tb').append(html);
        }

     
 
        //调用斑马纹的函数
        
    });
    
}


//新增按钮
function XinZeng_btn() {
    // console.log('点击了新增'); 

    window.location.href = './CreateOrEdit.html';
}


//保存  新增和编辑
function Save() {

    let name = $('[name=name]').val();
    let stock = $('[name=stock]').val();
    let price = $('[name=price]').val();
    let pps = $('[name=pps]').val();



    let obj = {
        name, stock, price, pps
    }

    //这是用来获取url传的id
    let reqiestPut_id = location.search.split('=')[1];
  
    //如果id是空的 说明是添加页面 因为只有编辑页面才会传id
    if (reqiestPut_id == undefined || reqiestPut_id == '') {
        $.post('http://localhost:8000/product', obj, (res) => {

        
                    console.log(res);
                    if(res.code==400){
                        alert('不能重复添加商品！')
                    }else{
                        query_true(res);
                        window.location.href='./index.html'
                    }
           
        })
    } else {
        console.log('编辑');

        obj = {
            "id": reqiestPut_id,
            name, stock, price, pps
        }
        $.ajax({
            type: "put",
            contenType: "application/json",
            url: `http://localhost:8000/product`,
            data: obj,
            success: function (result) {
                console.log(result);
                query_true(result)
                window.location.href = './index.html';
            }
        })
    }





}


//取消按钮
function QuXiao() {
    window.location.href = './index.html'
}

//删除的功能
function btn_del(id) {
    console.log('点击了删除' + id);
    if(confirm('确认删除吗？')){
        $.ajax({
            type: "delete",
            contenType: "application/json",
            url: `http://localhost:8000/product${id}`,
            data: JSON.stringify(),
            success: function (result) {
                query_true(result)
    
            }
        })
    }
   

}

//编辑按钮
function btn_edit(id) {

    $.get(`http://localhost:8000/product${id}`, (data) => {
        //点击编辑按钮的时候  跳转到页面且把id传过去
        window.location.href = `./CreateOrEdit.html?id=${id}`;

    })


}




